import React from "react";
import style from "./index.module.scss";
import {antFilltag_icon,location_icon,
    wechatmoment_icon,wechat_icon,qq_icon,weibo_icon
} from "../../common/icon/svg";
import header from "../../base/Header";

import {Image} from "antd";
const imgErr = require("../../common/imageDefault/imgloaderr.png").default;
const bookCoverDefault = require("../../common/imageDefault/book-cover-default.png").default

import {Toast,Button,Modal} from "antd-mobile";
const prompt = Modal.prompt;

class ReleaseSuccess extends React.Component {
    state = {
        bookinfoShort:{
            bid:"eyiwue-4342-erwoi",
            name:"发布图书",
            cover:bookCoverDefault,
       }
    }

    componentDidMount(){
        let bookinfoShort = this.props.location.state;
        if(bookinfoShort){
            let {bookinfoShort : defaultData} = this.state;
            bookinfoShort = Object.assign({}, defaultData, bookinfoShort);
            this.setState({bookinfoShort});
        }
    }

    render(){
        let {bookinfoShort} = this.state;

        return(
            <div className={style["index-root"]}>
                {header({title:"发布成功", btn:true})}

                <div className={style["bookinfo-short-box"]}>
                    <div className={style["box"]}>
                        <Image className={style["book-cover"]} src={bookinfoShort.cover} fallback={imgErr} />
                        {bookinfoShort.bid
                            ?  <div onClick={()=>{
                                        this.props.history.push(`/msg/${this.state.bookinfoShort.bid}`)
                                    }}
                                ><p>查看详情</p></div>
                            : <div>《<p>{bookinfoShort.name}</p>》</div>
                        }
                    </div>
                </div>

                <div className={style["share-box"]}>
                    <p className={style["title"]}>分享</p>
                    <div className={style["box"]}>
                        <span>{wechatmoment_icon}</span>
                        <span>{wechat_icon}</span>
                        <span style={{backgroundColor:"orangered"}}
                            onClick={()=>{
                                const _this = this;
                                let copyOrangin = this.copyOrangin;
                                copyOrangin.value=`http://localhost:8095/bookInfoDetails/${_this.state.bookinfoShort.bid}`
                                copyOrangin.select();
                                if(document.execCommand("copy")){
                                    document.execCommand('copy');
                                    console.log('复制成功');
                                    prompt('图书分享', '输入分享好友的QQ号', [
                                        { text: '取消' }, { text: '分享', onPress: value => {
                                            console.log(`好友QQ号：${value}`);
                                            _this.shareLink.href=`tencent://message/?uin=${value}&Site=有事Q我&Menu=yes`;
                                            Toast.info("分享连接已经复制到剪贴板！",2);
                                            setTimeout(()=>{
                                                _this.shareLink.click();
                                            },1000)
                                    }}], 'default', '1609664431');
                                }
                            }}
                        >{qq_icon}</span>
                        <span>{weibo_icon}</span>
                    </div>
                        <a ref={shareLink => this.shareLink = shareLink}></a>
                         {/* <a href="tencent://message/?uin=1609664431&Site=在线QQ&Menu=yes"> QQ分享 </a> */}
                        <input style={{left:"-200px",position:"absolute"}}  ref={copyOrangin => this.copyOrangin = copyOrangin}></input>
                </div>
    
                <div style={{position:"absolute"}}>
                    <a href="tencent://snsapp/?cmd=2&ver=1&uin=1609664431&fuin=要召唤的QQ">打开指定资料卡</a>——
                    <a href="tencent://Message/?uin=1609664431">弹出好友聊天窗口</a>——
                    <a href="tencent://snsapp/?cmd=3&ver=1&uin=1609664431&fuin=1397306263">弹出好友聊天窗口</a>——
                    <a href="tencent://message/?uin=88888888&Site=JooIT.com&Menu=yes">弹出非好友聊天窗口</a>——
                    <a href="tencent://confhr/?subcmd=Start&fuin=1397306263&discname=BookSell&user=ttt">召唤多人聊天</a>——
                    <a href="tencent://QTalk/?subcmd=Startup&account=1609664431&roomid=0&fuin=1397306263">进入对方的QT房间</a>——
                    <a href="http://q2.qlogo.cn/headimg_dl?dst_uin=1609664431&spec=100">QQ头像</a>——
                    <a href="http://users.qzone.qq.com/fcg-bin/cgi_get_portrait.fcg?uins=1609664431">QQ网名</a>——
                    <a href="http://r.qzone.qq.com/fcg-bin/cgi_get_portrait.fcg?uins=1609664431">QQ网名</a>——
                    <a href="http://p.qlogo.cn/gh/544157317/100/">QQ群</a>——
                </div>
               
                <div className={style["op-box"]}>
                    <Button inline={true} className={style["btn"]}
                        onClick={()=>{this.props.history.push("/booksell")}}
                    >继续卖书</Button>

                    <Button inline={true} className={style["go-home"]}
                        onClick={()=>{this.props.history.push("/home")}}
                    >返回主页</Button>
                </div> 
               
            </div>
        )
    }
}

export default ReleaseSuccess